<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="UTF-8" import="java.util.List"
	import="xyz.xiangyushui.javaBean.employee.Store" import="xyz.xiangyushui.javaBean.salesPlan.DailyPlanCommodity"
	import="java.time.LocalDate"
	import="java.time.format.DateTimeFormatter"%>
<%@include file="/lib/common/basedir.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
<%@include file="/lib/common/headerResource.html"%>

<!--sidebar-->
<link href="<%=basedir%>/lib/css/sidebar.css" rel="stylesheet">

<!-- picture cover -->
<link rel="stylesheet" type="text/css"
	href="<%=basedir%>/lib/util/pictureCover/css/normalize.css" />
<link rel="stylesheet"
	href="<%=basedir%>/lib/util/pictureCover/css/style.css">

<!--date-picker-->
<link
	href="<%=basedir%>/lib/util/datetimepicker/bootstrap-datetimepicker.min.css"
	rel="stylesheet">

<link
	href="<%=basedir%>/lib/util/bootstrap-select/bootstrap-select.min.css"
	rel="stylesheet">

<title>DessertHouse</title>

<style>
img {
	width: 250px;
}

.rowGap2 {
	margin-bottom: 2.4em;
}

.subtitle {
	margin-top: 0.2em;
}

.formContent {
	margin-top: 3em;
	margin-bottom:3em;
}

.line{
	margin-right:1.5em;
}

</style>

</head>
<body>
	<div class="container-fluid">
		<div class="row">
			<!--左侧导航-->
			<div class="col-sm-3 col-md-2 sidebar">
				<%@include file="../sidebar.jsp"%>
			</div>

			<!--右面板-->
			<div
				class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 rightPanel">
				<div class="col-md-10">
					<div class="row">
						<ul class="nav nav-tabs">
							<li role="presentation" class="active"><a href="<%=basedir %>/member">所有甜品</a></li>
							<li role="presentation"><a href="<%=basedir %>/member/myReservation">我的预定</a></li>
						</ul>
					</div>


					<form class="form-inline formContent" method="post" action="<%=basedir%>/member/reserve">
						<div class="form-group line">
							<div class="input-group date form_date " data-date=""
								data-date-format="yyyy-mm-dd" data-link-field="dtp_input2"
								data-link-format="yyyy-mm-dd" style="padding-left:0;">
								<input class="form-control" name="date" size="16" type="text"
									value="<%=LocalDate.now().format(DateTimeFormatter.ofPattern("yyyy-MM-dd"))%>"> <span class="input-group-addon"><span
									class="glyphicon glyphicon-calendar"></span></span>
							</div>
							<input type="hidden" id="dtp_input2" value="" /><br />
						</div>
						<div class="form-group line">
								<select id="lunchBegins" name="store" class="selectpicker"
									data-live-search="true" data-live-search-style="begins"
									title="请选择店铺">
<%
									@SuppressWarnings("unchecked")
									List<Store> stores = (List<Store>) request.getAttribute("stores");
									String date_storeId=(String)request.getAttribute("date_storeId");
									if (stores != null) {
										for (Store s : stores) {
								%>
								<option><%=s.getStoreId() + "-" + s.getStoreName()%></option>
								<%
									}
									}
								%>

								</select>
						</div>
						<div class="form-group line">
								<button type="submit" class="btn btn-default btn-block save col-md-2">查询</button>
						</div>
						
				</form>

				<%
				    @SuppressWarnings("unchecked")
					List<DailyPlanCommodity> comms=(List<DailyPlanCommodity>)request.getAttribute("commodities");
					if(comms!=null){
						for(int i=0;i<comms.size();i++){
							if(i==0){
								
					
				
				%>
				<div class="row rowGap2">
					<div class="col-sm-6 col-md-4">
						<div class="container<%=i%>">
							<img src="<%=basedir%>/img/1.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>
				
				<%		}else if(i%3==0){%>
					
					</div>
					<div class="row rowGap2">
					<div class="col-sm-6 col-md-4">
						<div class="container<%=i%>">
							<img src="<%=basedir%>/img/1.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>
					
					<%}else{ %>
					
					<div class="col-sm-6 col-md-4">
						<div class="container<%=i%>">
							<img src="<%=basedir%>/img/<%=i+1 %>.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>
					
				<%}
						}
					} %>
				
				<!-- 

				<div class="row rowGap2">
					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/1.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>

					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/2.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>

					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/3.jpg" alt="cheese souffle ">
						</div>
					</div>
				</div>

				<div class="row rowGap2">
					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/4.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>

					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/5.jpg"
								alt="Generic placeholder thumbnail">
						</div>
					</div>

					<div class="col-sm-6 col-md-4">
						<div class="container4">
							<img src="<%=basedir%>/img/6.jpg" alt="cheese souffle ">
						</div>
					</div>
				</div>
				 -->
				  
			</div>
		</div>
	</div>
	</div>
	</div>


	<!-- jquery and bootstrap js -->
	<%@include file="/lib/common/footerResource.html"%>
	<script src="<%=basedir%>/lib/util/pictureCover/js/ns.hover.min.js"></script>
	<script
		src="<%=basedir%>/lib/util/datetimepicker/bootstrap-datetimepicker.min.js"></script>
	<script
		src="<%=basedir%>/lib/util/bootstrap-select/bootstrap-select.js"></script>

	<script>
		$('.form_date').datetimepicker({
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			minView : 2,
			forceParse : 0,
			pickerPosition : "bottom-left"
		}).on('changeDate', function() {
			//window.location = "http://www.baidu.com/$('#dtp_input2').val()";
			//jQuery.noConflict();
			//alert(jQuery('#dtp_input2').val());
		});
		window.onload = function() {
			$.noConflict();
			jQuery(document)
					.ready(
							function($) {
								<%if(comms!=null){
									for(int i=0;i<comms.size();i++){%>
									
								$('.container<%=i%>')
										.nsHover(
												{
													bgcolor : '#000',
													bganim : 'fade',
													bgpic : '',
													content : '<div class="content"><h3>'+'<%=comms.get(i).getCommodityIdName()%>'+'</h3><p style="margin-left:6px;margin-right:6px;color:white;font-size:1em;">price:$'+'<%=comms.get(i).getPrice()%>'+' stcok:'+'<%=comms.get(i).getNum()%>'+'</p><a href="<%=basedir%>/member/reserve/commodity?store=<%=date_storeId%>&&id=<%=comms.get(i).getCommodityIdName()%>" class="btn btn-info" role="button" >reserve</a> </div>'
												});

								
								<%
									}}%>
								
							});
		}
	</script>
</body>
</html>